<template>
	<view class="content">
		<!-- 对话内容 -->

		<scroll-view :scroll-y="true" :scroll-top="scrollTop" :style="'height:'+heights+'px;'" @click="shouqi">


			<view class="" v-for="(item,index) in list">
				<view class="shijianb" v-if="jiexishijian(index,item.time) !=0">
					<text class="shijian">{{jiexishijian(index,item.time)}}</text>
				</view>
				<view class="nei" v-if="item.flow=='in'">
					<image @click="tzgez(item.from)" class="tx" :src="headImg" mode="widthFix"></image>
					<text class="left-triangle"></text>
					<!-- 文字图片 -->
					<rich-text v-if="item.type=='text'" class='record-chatting-item-text'
						:nodes="generateRichTextNode(item.text)"></rich-text>
					<image style="width: 500upx;height: auto;" class='record-chatting-item-text'
						v-if="item.type=='image'" :src="item.file.url" @click="djyltp(item.file.url)" mode="widthFix">
					</image>
					<view v-if="item.type == 'audio'" class="audio-wrapper" style="background: #FFFFFF;"
						@click="bofyuy(index)">
						<image src="../../static/img/tab/bofang.png" mode="widthFix" class="bofdj"></image>
						<!-- 时间 -->
						<text class="text">{{item.file.dur}}''</text>
					</view>
				</view>
				<!-- 	'text' (文本消息)
			'image' (图片消息)
			'audio' (音频消息)
			'video' (视频消息) -->
				<view class="nei self" v-if="item.flow=='out'">
					<!-- 语音 -->
					<view v-if="item.type == 'audio'" class="audio-wrapper" @click="bofyuy(index)">
						<text class="text"> {{item.file.dur}}'' </text>
						<image src="../../static/img/tab/bofang.png" mode="widthFix" style="width:60upx;height: auto;">
						</image>
					</view>

					<rich-text v-if="item.type=='text'" class='record-chatting-item-text bg'
						:nodes="generateRichTextNode(item.text)"></rich-text>
					<image style="width: 500upx;height: auto;" class='record-chatting-item-text bg'
						v-if="item.type=='image'" :src="item.file.url" @click="djyltp(item.file.url)" mode="widthFix">
					</image>
					<text class="right-triangle"></text>
					<image @click="tzgez(item.from)" class="tx" :src="iheadImg" mode="widthFix"></image>
					<view style="width:40upx;">
					</view>
				</view>

			</view>


			<view style="height: 500upx;">

			</view>

		</scroll-view>


		<u-popup v-model="shareShow" mode="center">
			<image src="https://webapp.test.shenghua6.cn/st/mini/static/img/xcxydy/xiazaitanch.png"
				style="height: auto;" mode="widthFix">
			</image>
			<view style="display:flex;width:100%;margin:-190upx auto;height: 20rpx;">
				<button style="width:50%; height:120upx; display: flex;align-items: center; border:none;" plain="true"
					@click="downApp()">
					<image style="width:100%;height: auto;" :src="$BASE_URL +'/st/mini/static/img/gender/fuzhi.png'"
						mode="widthFix">
					</image>
				</button> <button style="width:50%; height:120upx; display: flex;align-items: center; border:none;"
					open-type="contact" plain="true" @click="jinrfxkf">
					<image style="width:100%;height: auto;" :src="$BASE_URL +'/st/mini/static/img/gender/qxz.png'"
						mode="widthFix">
					</image>
				</button>
			</view>

			<view
				style="font-family: PingFangSC-Regular;font-size:26upx;color: #5C60B6;text-align:center;margin-top: 290upx;">
				复制后请在浏览器打开
			</view>
			<view style="height:35upx;"></view>
		</u-popup>



		<view class="dibu" style="background-color: #fff;" :style="[{'bottom':Height+'px;'}]">



			<view class="bottom">
				<view style="width:3%;">
				</view>
				<view class="chatinput-content">



					<!-- 				<textarea  @input="inputt"  class="input" type="text" placeholder="打招呼会有意想不到的收获哦~" v-model="nero"
						cursor-spacing="25" :auto-height="true" :show-confirm-bar="false" :adjust-position="false"
						@blur="leaveInput" @focus="getHeight" value="" maxlength="100"    ></textarea> -->

					<input @input="inputt" class="input" type="text" placeholder="打招呼会有意想不到的收获哦~" v-model="nero"
						cursor-spacing="25" :auto-height="true" :show-confirm-bar="false" :adjust-position="false"
						@blur="leaveInput" @focus="getHeight" value="" maxlength="100" />
					<image class="bqico"
						src="https://webapp.test.shenghua6.cn/st/mini/static/img/xcxydy/biaosida.png"
						mode="widthFix" @click="biaoqings"></image>
					<view style="width:2%;">
					</view>
				</view>
				<view style="width:15upx;">

				</view>
				<image @click="fasongrup()" style="width: 70upx;height: auto;"
					src="https://webapp.test.shenghua6.cn/st/mini/static/img/xcxydy/tulku.png"
					mode="widthFix">
				</image>
				<view :class="bottomstyle?'annius':'anniu'" @click="fasong()">
					发送
				</view>
				<view style="width:3%;">
				</view>
			</view>


			<emojis v-if="emojs" @EmojiClick="emojiCLick" @EmojiSend="emojiSend" style="width: 100%;  "> </emojis>
		</view>







	</view>
</template>







<!-- 表情按钮置灰 -->
<!-- https://php.zgsj1.com/upload_video/20211109/8c03788a350b590b127b9e701e0ff910.png -->
<!-- 表情按钮选中 -->
<!-- https://php.zgsj1.com/upload_video/20211109/5a1eb3c503a2ec91d8bb8c2ca9aef0d9.png -->
<!-- 图库 -->
<!-- https://php.zgsj1.com/upload_video/20211109/3ae322a7ce6f3eb849503cdbad4f4e60.png -->
<!-- 聊天超过次数 -->
<!-- https://php.zgsj1.com/upload_video/20211208/08cf1c9122681ed6658bb0ba64d22837.png -->

<script>
	import emojis from '@/pages/components/emoji/emoji'
	export default {
		components: {
			emojis
		},

		data() {
			return {

				// 防止恶意点击
				tapTime: 0,

				// 发送多少条消息
				messageCount: 3,

				// 视图高度
				heights: 0,

				// 图片主域名
				$BASE_URL: this.$BASE_URL,
				// 弹窗展示
				shareShow: false,
				// 聊天列表
				list: [],
				// 按钮样式
				bottomstyle: false,
				scrollTop: 0,
				nodes: '测试数据',
				nero: "",
				// 当前联系人ID
				to: 0,
				custom: '',
				headImg: '',
				name: '',
				iheadImg: '',
				Height: 0,
				// 播放音频
				innerAudioContext: '',
				// 播放路径暂存
				url: '',
				// 消息id
				xxid: 0,
				emoji: {},
				emojs: false,
				// 语音倒计时的计时器
				myVar: null,

				// 正在播放语音的下标
				yyidex: -1,



			}
		},



		onLoad(e) {



			var _this = this

			uni.getSystemInfo({
				success(res) {

					_this.heights = res.windowHeight - 40;
					console.log('获取到页面高度', res)

				}
			})


			// 获取设备信息安卓或ios
			if (uni.getSystemInfoSync().platform == 'android') {
				this.getAppDownloadUrl('android')
				console.log('android', "安卓 链接")
			} else {
				this.getAppDownloadUrl('ios')
				console.log('ios', "苹果 链接")
			}




			// 赋值表情
			this.emoji = {
				"emoji": {
					"[大笑]": {
						file: "emoji_0.png"
					},
					"[可爱]": {
						file: "emoji_01.png"
					},
					"[色]": {
						file: "emoji_02.png"
					},
					"[嘘]": {
						file: "emoji_03.png"
					},
					"[亲]": {
						file: "emoji_04.png"
					},
					"[呆]": {
						file: "emoji_05.png"
					},
					"[口水]": {
						file: "emoji_06.png"
					},
					"[汗]": {
						file: "emoji_145.png"
					},
					"[呲牙]": {
						file: "emoji_07.png"
					},
					"[鬼脸]": {
						file: "emoji_08.png"
					},
					"[害羞]": {
						file: "emoji_09.png"
					},
					"[偷笑]": {
						file: "emoji_10.png"
					},
					"[调皮]": {
						file: "emoji_11.png"
					},
					"[可怜]": {
						file: "emoji_12.png"
					},
					"[敲]": {
						file: "emoji_13.png"
					},
					"[惊讶]": {
						file: "emoji_14.png"
					},
					"[流感]": {
						file: "emoji_15.png"
					},
					"[委屈]": {
						file: "emoji_16.png"
					},
					"[流泪]": {
						file: "emoji_17.png"
					},
					"[嚎哭]": {
						file: "emoji_18.png"
					},
					"[惊恐]": {
						file: "emoji_19.png"
					},
					"[怒]": {
						file: "emoji_20.png"
					},
					"[酷]": {
						file: "emoji_21.png"
					},
					"[不说]": {
						file: "emoji_22.png"
					},
					"[鄙视]": {
						file: "emoji_23.png"
					},
					"[阿弥陀佛]": {
						file: "emoji_24.png"
					},
					"[奸笑]": {
						file: "emoji_25.png"
					},
					"[睡着]": {
						file: "emoji_26.png"
					},
					"[口罩]": {
						file: "emoji_27.png"
					},
					"[努力]": {
						file: "emoji_28.png"
					},
					"[抠鼻孔]": {
						file: "emoji_29.png"
					},
					"[疑问]": {
						file: "emoji_30.png"
					},
					"[怒骂]": {
						file: "emoji_31.png"
					},
					"[晕]": {
						file: "emoji_32.png"
					},
					"[呕吐]": {
						file: "emoji_33.png"
					},
					"[拜一拜]": {
						file: "emoji_160.png"
					},
					"[惊喜]": {
						file: "emoji_161.png"
					},
					"[流汗]": {
						file: "emoji_162.png"
					},
					"[卖萌]": {
						file: "emoji_163.png"
					},
					"[默契眨眼]": {
						file: "emoji_164.png"
					},
					"[烧香拜佛]": {
						file: "emoji_165.png"
					},
					"[晚安]": {
						file: "emoji_166.png"
					},
					"[强]": {
						file: "emoji_34.png"
					},
					"[弱]": {
						file: "emoji_35.png"
					},
					"[OK]": {
						file: "emoji_36.png"
					},
					"[拳头]": {
						file: "emoji_37.png"
					},
					"[胜利]": {
						file: "emoji_38.png"
					},
					"[鼓掌]": {
						file: "emoji_39.png"
					},
					"[握手]": {
						file: "emoji_200.png"
					},
					"[发怒]": {
						file: "emoji_40.png"
					},
					"[骷髅]": {
						file: "emoji_41.png"
					},
					"[便便]": {
						file: "emoji_42.png"
					},
					"[火]": {
						file: "emoji_43.png"
					},
					"[溜]": {
						file: "emoji_44.png"
					},
					"[爱心]": {
						file: "emoji_45.png"
					},
					"[心碎]": {
						file: "emoji_46.png"
					},
					"[钟情]": {
						file: "emoji_47.png"
					},
					"[唇]": {
						file: "emoji_48.png"
					},
					"[戒指]": {
						file: "emoji_49.png"
					},
					"[钻石]": {
						file: "emoji_50.png"
					},
					"[太阳]": {
						file: "emoji_51.png"
					},
					"[有时晴]": {
						file: "emoji_52.png"
					},
					"[多云]": {
						file: "emoji_53.png"
					},
					"[雷]": {
						file: "emoji_54.png"
					},
					"[雨]": {
						file: "emoji_55.png"
					},
					"[雪花]": {
						file: "emoji_56.png"
					},
					"[爱人]": {
						file: "emoji_57.png"
					},
					"[帽子]": {
						file: "emoji_58.png"
					},
					"[皇冠]": {
						file: "emoji_59.png"
					},
					"[篮球]": {
						file: "emoji_60.png"
					},
					"[足球]": {
						file: "emoji_61.png"
					},
					"[垒球]": {
						file: "emoji_62.png"
					},
					"[网球]": {
						file: "emoji_63.png"
					},
					"[台球]": {
						file: "emoji_64.png"
					},
					"[咖啡]": {
						file: "emoji_65.png"
					},
					"[啤酒]": {
						file: "emoji_66.png"
					},
					"[干杯]": {
						file: "emoji_67.png"
					},
					"[柠檬汁]": {
						file: "emoji_68.png"
					},
					"[餐具]": {
						file: "emoji_69.png"
					},
					"[汉堡]": {
						file: "emoji_70.png"
					},
					"[鸡腿]": {
						file: "emoji_71.png"
					},
					"[面条]": {
						file: "emoji_72.png"
					},
					"[冰淇淋]": {
						file: "emoji_73.png"
					},
					"[沙冰]": {
						file: "emoji_74.png"
					},
					"[生日蛋糕]": {
						file: "emoji_75.png"
					},
					"[蛋糕]": {
						file: "emoji_76.png"
					},
					"[糖果]": {
						file: "emoji_77.png"
					},
					"[葡萄]": {
						file: "emoji_78.png"
					},
					"[西瓜]": {
						file: "emoji_79.png"
					},
					"[光碟]": {
						file: "emoji_80.png"
					},
					"[手机]": {
						file: "emoji_81.png"
					},
					"[电话]": {
						file: "emoji_82.png"
					},
					"[电视]": {
						file: "emoji_83.png"
					},
					"[声音开启]": {
						file: "emoji_84.png"
					},
					"[声音关闭]": {
						file: "emoji_85.png"
					},
					"[铃铛]": {
						file: "emoji_86.png"
					},
					"[锁头]": {
						file: "emoji_87.png"
					},
					"[放大镜]": {
						file: "emoji_88.png"
					},
					"[灯泡]": {
						file: "emoji_89.png"
					},
					"[锤头]": {
						file: "emoji_90.png"
					},
					"[烟]": {
						file: "emoji_91.png"
					},
					"[炸弹]": {
						file: "emoji_92.png"
					},
					"[枪]": {
						file: "emoji_93.png"
					},
					"[刀]": {
						file: "emoji_94.png"
					},
					"[药]": {
						file: "emoji_95.png"
					},
					"[打针]": {
						file: "emoji_96.png"
					},
					"[钱袋]": {
						file: "emoji_97.png"
					},
					"[钞票]": {
						file: "emoji_98.png"
					},
					"[银行卡]": {
						file: "emoji_99.png"
					},
					"[手柄]": {
						file: "emoji_100.png"
					},
					"[麻将]": {
						file: "emoji_101.png"
					},
					"[调色板]": {
						file: "emoji_102.png"
					},
					"[电影]": {
						file: "emoji_103.png"
					},
					"[麦克风]": {
						file: "emoji_104.png"
					},
					"[耳机]": {
						file: "emoji_105.png"
					},
					"[音乐]": {
						file: "emoji_106.png"
					},
					"[吉他]": {
						file: "emoji_107.png"
					},
					"[火箭]": {
						file: "emoji_108.png"
					},
					"[飞机]": {
						file: "emoji_109.png"
					},
					"[火车]": {
						file: "emoji_110.png"
					},
					"[公交]": {
						file: "emoji_111.png"
					},
					"[轿车]": {
						file: "emoji_112.png"
					},
					"[出租车]": {
						file: "emoji_113.png"
					},
					"[警车]": {
						file: "emoji_114.png"
					},
					"[自行车]": {
						file: "emoji_115.png"
					}
				}
			}


			var _this = this



			// 发送表情的观察者模式
			uni.$on('EmojiClick', (e) => {
				//  
				_this.jieshou(e)
			})


			this.to = e.to
			// 自己的头像
			var img = uni.getStorageSync("userInfo").headImg;
			this.iheadImg = this.touxiang(img)
			var _this = this
			_this.$NIM.getUser({
				account: e.to,
				done: getUserDone
			});

			function getUserDone(s, e) {
				console.log(e, "返回对方信息666")
				console.log(e, "返回对方信息")
				_this.headImg = _this.touxiang(e.avatar)
				uni.setNavigationBarTitle({
					title: e.nick
				})
			}


			// 提升页面高度
			// 请求聊天记录
			this.qqltjl()
			var _this = this
			// 更新会话
			uni.$on('updateHH', (e) => {
				console.log(e, '更新会话')
				_this.scrollTop = _this.scrollTop + _this.list.length * Math.random() * 1000

			})



			this.innerAudioContext = uni.createInnerAudioContext();
			this.innerAudioContext.autoplay = false;
			this.innerAudioContext.onPlay(() => {
				console.log('开始播放');
			});
			// 监听播放错误
			this.innerAudioContext.onError((res) => {
				console.log(res.errMsg);
				console.log(res.errCode);
			})





			// 重置会话未读状态
			// this.shewei()
			// // 请求本地聊天记录
			// this.bdltjl()



		},
		onHide() {

		},
		onShow() {

			// 查询聊天可以发送多少条信息
			this.cxzs()
		},


		onUnload() {
			var _this = this



			// 是否在播放呢
			var state = this.innerAudioContext.paused;


			if (!state) {
				// 清除计时器
				clearInterval(_this.myVar);
				this.innerAudioContext.stop(); //关闭

				_this.list[_this.yyidex].file.dur = _this.list[_this.yyidex].file.dus

			}








			// 销毁播放语音的倒计时''
			clearInterval(_this.myVar);
			// 重置会话未读状态
			this.shewei()
			// 移除监听事件  
			uni.$off('updateHH');
			uni.$off('EmojiClick');
			_this.innerAudioContext.stop();
		},

		methods: {





			//      对弹窗 内的操作，
			tuanchuangnecz: function(i, e) {

				// #ifdef  MP-WEIXIN

				// PopUpClick	弹窗内点击		$预置属性		
				// 		$is_first_time	是否首次	BOOL	
				// 		button_name	按钮名称	STRING	引导下载APP海报弹窗复制链接/引导下载APP海报弹窗点击下载/下载APP弹窗取消/下载APP弹窗一键复制/关注公众号充值弹窗保存
				// 		PopUp_name	弹窗名称	STRING	引导下载APP海报弹窗/下载APP弹窗/关注公众号充值弹窗
				// 		current_page	当前页面	STRING	交友tab/一对一消息/厅内/我tab
				// 		room_id	房间ID	STRING	
				getApp().sensors.track('PopUpClick', {
					$is_first_time: uni.getStorageSync("shifoushouci") == 2 ? 'false' : 'true',
					PopUp_name: i,
					button_name: e,
					current_page: '一对一消息',
					room_id: '',
				})
				// #endif
			},




			// 防止恶意点击
			fangdou: function() {
				var nowTime = Math.round(new Date());
				console.log('距离上次点击', nowTime - this.tapTime, '毫秒')
				if (nowTime - this.tapTime < 300) {
					console.log('阻断')
					this.tapTime = nowTime
					return false;
				} else {
					this.tapTime = nowTime
					return true
					console.log('执行')
				}

			},




			// 查询聊天可以发送多少条信息
			cxzs: function() {
				var data = {
					url: "/web/v2//api/newApi/wechat/faxianListShowCount",
					methods: "post",
					data: {

					},
				};

				var _this = this

				this.$http(data).then(res => {

					if (res.data.code == 21000) {

						_this.messageCount = res.data.data.messageCount

					}

				})

			},




			// 语音时间解析
			yysjjx: function(e) {

				return Math.round(e / 1000);

			},


			// 触发屏幕空白的点击事件关闭表情框
			shouqi: function(e) {

				this.emojs = false
			},


			// 弹窗的埋点			
			tanchaungmd: function() {
				// #ifdef  MP-WEIXIN
				// PopUpShow	弹窗浏览		$预置属性		
				// 		$is_first_time	是否首次	BOOL	
				// 		PopUp_name	弹窗名称	STRING	引导下载APP海报弹窗/下载APP弹窗/关注公众号充值弹窗
				// 		current_page	当前页面	STRING	交友tab/一对一消息/厅内/我tab/
				// 		room_id	房间ID	STRING	
				getApp().sensors.track('PopUpShow', {
					$is_first_time: uni.getStorageSync("shifoushouci") == 2 ? 'false' : 'true',
					PopUp_name: '引导下载APP海报弹窗',
					current_page: '一对一消息',
					room_id: '',
				})
				// #endif
			},



			// 点击预览图片
			djyltp: function(e) {
				let _this = this;
				let imgsArray = [];
				imgsArray[0] = e
				uni.previewImage({
					current: 0,
					urls: imgsArray
				});
			},





			//   * emoji组件回调
			//    */
			jieshou(e) {

				let val = e.emoji
				console.log('开发观察者模式', val)
				// 单击删除按钮，，删除emoji
				if (val == '[删除]') {
					let lastIndex = this.nero.lastIndexOf('[')
					if (lastIndex != -1) {
						this.nero = this.nero.slice(0, lastIndex)

						// this.setData({
						// 	inputValue: this.data.inputValue.slice(0, lastIndex)
						// })
					}
					return
				}
				if (val[0] == '[') { // emoji

					this.nero = this.nero + val
					// this.setData({
					// 	inputValue: this.data.inputValue + val
					// })
				} else { //大图
					// this.sendBigEmoji(val)
				}
				this.inputt()
			},



			// 表情打开
			biaoqings: function() {
				this.emojs = !this.emojs

				if (!this.emojs == false) {
					this.Height = 0
				} else {
					this.Height = 0
				}



			},

			// 生成富文本方法
			generateRichTextNode(text) {
				let emoji = this.emoji.emoji
				let tempStr = text
				let richTextNode = []
				let leftBracketIndex = tempStr.indexOf('[')
				let rightBracketIndex = tempStr.indexOf(']')
				let countOfWord = 0


				Array.from(tempStr).map(item => {
					if (item != '[' && item != ']') {
						countOfWord++
					}
				})
				if (leftBracketIndex == -1 || rightBracketIndex == -1 || countOfWord == 0) { //没有emoji
					richTextNode.push({
						type: 'text',
						text: tempStr
					})
					return richTextNode
				}
				while (tempStr.length != 0) {
					leftBracketIndex = tempStr.indexOf('[')
					rightBracketIndex = tempStr.indexOf(']')
					if (leftBracketIndex == 0) { // 开头是[
						rightBracketIndex = tempStr.indexOf(']')
						if (rightBracketIndex == -1) {
							richTextNode.push({
								type: 'text',
								text: tempStr
							})
							tempStr = ''
						} else {
							let emojiName = tempStr.slice(0, rightBracketIndex + 1)

							if (emoji[emojiName]) { // 有效emoji

								richTextNode.push({
									name: 'img',
									attrs: {
										width: '30rpx',
										height: '30rpx',
										src: 'http://yx-web.nosdn.127.net/webdoc/h5/emoji/emoji/' + emoji[
											emojiName].file
									}
								})

							} else { //无效emoji
								richTextNode.push({
									type: 'text',
									text: emojiName
								})
							}
							tempStr = tempStr.substring(rightBracketIndex + 1, tempStr.length)
						}
					} else { // 开头不是[
						if (leftBracketIndex == -1) { // 最后全是文字
							richTextNode.push({
								type: 'text',
								text: tempStr.slice(0, tempStr.length)
							})
							tempStr = ''
						} else {
							richTextNode.push({
								type: 'text',
								text: tempStr.slice(0, leftBracketIndex)
							})
							tempStr = tempStr.substring(leftBracketIndex, tempStr.length + 1)
						}
					}
				}
				return richTextNode
			},



			// 播放语音
			bofyuy: function(e) {
				var _this = this

				var url = _this.list[e].file.mp3Url
				// "https://nim-nosdn.netease.im/NDE1ODc0OQ==/bmltYV8zMjU0MDA5NjU5OF8xNjI4NzYzMDk5Mjg4X2U0ZjU2NjQ2LWU5OWYtNDI1OS04ODNlLTdiYmI3ZDE0ZGZmMg==?audioTrans&type=mp3"
				// return
				// 是否在播放呢
				var state = this.innerAudioContext.paused;
				console.log('是否在播放呢', state)
				if (!state) {
					console.log('正在播放的时候停止播放')



					if (_this.yyidex == e) {
						// 清除计时器
						clearInterval(_this.myVar);
						this.innerAudioContext.stop(); //关闭
						_this.list[_this.yyidex].file.dur = _this.list[_this.yyidex].file.dus
					} else {
						clearInterval(_this.myVar);
						_this.list[_this.yyidex].file.dur = _this.list[_this.yyidex].file.dus
					}




					// url 改成e
					if (this.url == url) {} else {
						this.innerAudioContext.src = url
						this.url = url
						// 开始播放
						this.innerAudioContext.play();

						// 赋值记录下标
						_this.yyidex = e

						// 计时器
						this.myVar = setInterval(function() {
							if (_this.list[e].file.dur > 0) {
								_this.list[e].file.dur = _this.list[e].file.dur - 1
							} else {
								// 清除计时器
								clearInterval(_this.myVar);
								_this.list[e].file.dur = _this.list[e].file.dus
							}
							_this.$forceUpdate()
						}, 1000);

					}

				} else {
					// 赋值记录下标
					_this.yyidex = e
					console.log('没有正在播放')
					this.innerAudioContext.src = url
					this.url = url
					// 开始播放
					this.innerAudioContext.play();
					// 开始播放计时器开始倒计时
					// 计时器
					this.myVar = setInterval(function() {
						if (_this.list[e].file.dur > 0) {
							_this.list[e].file.dur = _this.list[e].file.dur - 1
						} else {
							// 清除计时器
							clearInterval(_this.myVar);
							_this.list[e].file.dur = _this.list[e].file.dus
						}
						_this.$forceUpdate()
					}, 1000);
				}
			},


			//离开输入框触发
			leaveInput(e) {
				this.Height = 0; //输入框失去焦点时让距离底部距离为 0
				console.log('失去焦点')
				this.emojs = false
			},
			//点击输入框触发
			getHeight(e) {
				console.log(e, '我是获取输入法高度的')
				this.Height = e.target.height; //获取输入法的高度，动态设置输入框距离顶部距离。
				this.emojs = false
			},









			// 跳转个人资料页面

			tzgez: function(id) {

				uni.navigateTo({
					url: '../subpage/personaldata/personaldata?id=' + id
				})


			},





			// 设为已读

			shewei: function() {

				var _this = this


				var ssid = 'p2p-' + this.to

				_this.$NIM.resetSessionUnread(ssid, (err, falid) => {
					console.log('重置会话未读状态')
					if (err) {
						console.log('重置失败：', err, '失败的sessionid是', failid)
					}

				})


			},




			// 解析时间
			jiexishijian: function(i, e) {

				if (i > 0) {
					var sj = e - this.list[i - 1].time

					if (sj < 120000) {
						console.log('不展示')
						return 0
					} else {

						console.log('展示')
					}

				}



				// var timestamp4 = new Date(e); //直接用 new Date(时间戳) 格式转化获得当前时间
				var time = new Date(e);
				var y = time.getFullYear();
				var m = time.getMonth() + 1;
				var d = time.getDate();
				var h = time.getHours();
				var mm = time.getMinutes();
				var s = time.getSeconds();
				return y + '-' + m + '-' + d + ' ' + h + ':' + mm + ':' + s;
				return new Date(parseInt(e)).toLocaleString().replace(/:\d{1,2}$/, ' ');
				// timestamp4.toLocaleDateString().replace(/\//g, "-") + " " + timestamp4.toTimeString().substr(0,8); //再利用拼接正则等手段转化为yyyy-MM-dd hh:mm:ss 格式
				console.log('解析时间', shijian)
			},
			// 解析头像
			touxiang: function(e) {
				return this.$global.getImageUrl(e + '?x-oss-process=image/bright,15/resize,m_fill,h_150,w_150',
					"https://ourydcimage.shenghua6.cn")
			},
			jiexi: function(e) {
				return this.headImg = this.$global.getImageUrl(e +
					'?x-oss-process=image/bright,15/resize,m_fill,h_150,w_150',
					"https://ourydcimage.shenghua6.cn"
				);
			},
			// 请求聊天记录
			qqltjl: function() {
				var _this = this
				var gllist = getApp().globalData
				var id = 'p2p-' + this.to
				_this.list = gllist[id]


				_this.scrollTop = _this.scrollTop + _this.list.length * Math.random() * 1000



			},
			// 发送图片
			fasongrup: function() {
				var _this = this

				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album'], //从相册选择
					success: function(res) {

						console.log(JSON.stringify(res.tempFilePaths));
						var url = res.tempFilePaths[0]

						_this.fatp(url)
					}
				});

			},






			// 发送图片
			fatp: function(e) {
				var _this = this
				console.log('发送最后的图片', e)

				// 把当前发送记录缓存到本地
				var us = uni.getStorageSync(this.to)

				// 达到三次禁止发送
				if (us >= this.messageCount) {
					_this.shareShow = true
					// 触发 弹窗埋点

					// #ifdef  MP-WEIXIN
					_this.tanchaungmd()
					// #endif

					console.log('超出最大次数掉然后出弹窗')
					return
				}


				this.$NIM.sendFile({
					scene: 'p2p',
					to: this.to,
					type: 'image',
					wxFilePath: e,
					// fastPass: '{"w":200,"h":110,"md5":"xxxxxxxxx"}',
					beginupload: function(upload) {
						// - 如果开发者传入 fileInput, 在此回调之前不能修改 fileInput
						// - 在此回调之后可以取消图片上传, 此回调会接收一个参数 `upload`, 调用 `upload.abort();` 来取消文件上传
					},
					uploadprogress: function(obj) {
						console.log('文件总大小: ' + obj.total + 'bytes');
						console.log('已经上传的大小: ' + obj.loaded + 'bytes');
						console.log('上传进度: ' + obj.percentage);
						console.log('上传进度文本: ' + obj.percentageText);
					},
					uploaddone: function(error, file) {
						console.log(error);
						console.log(file);
						console.log('上传' + (!error ? '成功' : '失败'));

						if (us == "") {
							uni.setStorage({
								key: this.to,
								data: 1,
								success: function() {
									console.log('success');
								}
							});
						} else {
							uni.setStorage({
								key: this.to,
								data: parseInt(us) + 1,
								success: function() {
									console.log('success');
								}
							});
						}




					},
					beforesend: function(msg) {
						var gllist = getApp().globalData
						var use = gllist[msg.sessionId]
						if (use) {
							var d = gllist[msg.sessionId]
							// 储存聊天信息
							gllist[msg.sessionId].push(msg);
						} else {
							// 储存聊天信息
							gllist[msg.sessionId] = []
							gllist[msg.sessionId].push(msg);
						}

						console.log('正在发送p2p image消息, id=' + msg.idClient);
						// pushMsg(msg);
					},
					// done: sendMsgDone
				});
			},

			// 监听输入框
			inputt: function(e) {
				// // var s = e.detail.value

				var obj = this.nero.length
				var d = this.nero.split(" ").join("").length

				if (d >= 100) {

					uni.showToast({
						title: "文字超出100个",
						duration: 2000,
						icon: "none",
					});

					return

				}



				if (d === 0) {
					this.bottomstyle = false
				} else {
					this.bottomstyle = true
				}
			},

			// 触底下拉操作
			cdxl() {

			},

			// 发送
			fasong: function() {


				var re = this.fangdou()

				if (!re) {
					console.log('不行')
					return
				}

				if (this.bottomstyle) {
					this.wenben(this.nero)
				}
			},

			// 文本消息''
			wenben: function(e) {
				var _this = this
				var custom = this.custom
				// 把当前发送记录缓存到本地
				var us = uni.getStorageSync(this.to)
				// 达到三次禁止发送
				if (us >= this.messageCount) {
					_this.shareShow = !_this.shareShow
					// 触发 弹窗埋点
					// #ifdef  MP-WEIXIN
					_this.tanchaungmd()
					// #endif

					console.log('超出最大次数掉然后出弹窗')
					return
				}
				var msg = this.$NIM.sendText({
					scene: 'p2p',
					to: this.to,
					text: e,
					done: sendMsgDone,
					custom: this.custom,
					antiSpamUsingYidun: true,
					// isHistoryable: 是否存储云端历史
					// isRoamingable: 是否支持漫游
					isHistoryable: false,
					isRoamingable: false,
				});
				console.log('正在发送p2p text消息, id=' + msg.idClient);

				function sendMsgDone(error, msg) {
					var gllist = getApp().globalData
					var use = gllist[msg.sessionId]
					if (use) {
						var d = gllist[msg.sessionId]
						// 储存聊天信息
						gllist[msg.sessionId].push(msg);
					} else {
						// 储存聊天信息
						gllist[msg.sessionId] = []
						gllist[msg.sessionId].push(msg);
						_this.qqltjl()
					}
					console.log(error);
					console.log(msg);
					console.log('发送' + msg.scene + ' ' + msg.type + '消息' + (!error ? '成功' : '失败') + ', id=' +
						msg
						.idClient);
					if (!error) {

						if (us == "") {
							uni.setStorage({
								key: _this.to,
								data: 1,
								success: function() {
									console.log('success');
								}
							});
						} else {
							uni.setStorage({
								key: _this.to,
								data: parseInt(us) + 1,
								success: function() {
									console.log('success');
								}
							});
						}
						console.log('发送成功')
						_this.nero = "";
						_this.bottomstyle = false

					}
				}

			},




			// 获取下载链接
			getAppDownloadUrl(clientType) {
				console.log('获取' + clientType + ' 链接地址')
				var data = {
					url: '/web/v2/api/newApi/app/getAppDownloadUrl',
					methods: 'post',
					data: {
						clientType: uni.getStorageSync("qudao")
					}
				}
				this.$http(data).then(res => {
					console.log('获取下载链接', res)

					this.downloadUrl = res.data.data.url
				})
			},



			// 弹窗点击到客服的埋点
			jinrfxkf: function() {

				this.tuanchuangnecz('引导下载APP海报弹窗', '引导下载APP海报弹窗点击下载')
			},



			// 点击复制链接
			downApp() {

				this.copy(this.downloadUrl)

				// 点击弹窗内的埋点
				this.tuanchuangnecz('引导下载APP海报弹窗', '引导下载APP海报弹窗复制链接')

			},
			copy(value) {
				console.log(value, "复制的内容")
				uni.setClipboardData({
					data: value, //要被复制的内容
					success: function() {
						//重点~做笔记
						//在success中加入uni.hideToast()可以解决
						uni.showToast({
							title: '复制成功',
							duration: 2000,
							icon: 'none'
						});
						//以下就可自定义操作了~
					},
					fail: function(err) {
						console.log(value, "复制的内容", err, '复制失败')
						uni.showToast({
							title: '复制失败',
							duration: 2000,
							icon: 'none'
						});
					}
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.bottom {
		width: 100%;
		background-color: #fff;
		border: 2rpx solid #ccc;
		height: 100upx;
		display: flex;
		align-items: center;
		// justify-content: center;
	}

	.dibu {

		position: fixed;
		bottom: 0;
		width: 100%;
		// height: 430upx;

	}



	.bofdj {

		width: 60upx;
		height: auto;
		-webkit-transform: rotate(180deg);
		-moz-transform: rotate(180deg);
		-o-transform: rotate(180deg);
		-ms-transform: rotate(180deg);
		transform: rotate(180deg);

	}


	.anniu {
		color: #FFFFFF;
		border-radius: 15upx;
		font-size: 25upx;
		background: #C0C0C0;
		padding: 10upx 20upx;
		margin-left: auto;
	}

	.annius {
		color: #FFFFFF;
		border-radius: 15upx;
		font-size: 25upx;
		background: #3387ff;
		padding: 10upx 20upx;
		margin-left: auto;
	}


	.bqico {
		width: 50upx;
		height: auto;
		margin-left: auto;
	}


	.input {
		border-radius: 15upx;
		border: 2upx;
		padding: 15upx;
		font-size: 25upx;
		width: 80%;
		// white-space:nowrap;

		// 　　　　　　　　　　overflow：hidden；


	}

	.chatinput-content {
		width: 70%;
		height: 70upx;
		border: 1px solid #bfbfbf;
		border-radius: 20upx;
		display: flex;
		align-items: center;

	}




	.content {
		background: #f1f1f1;
		// border: 1px solid #000000;
		// height: 100%;
		// background: #F1F1F1;
	}


	// 去掉弹窗圆角
	.content /deep/ .u-mode-center-box {
		background: none;
	}


	.shijianb {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.shijian {
		padding: 4rpx 10rpx;
		background: #D6D6D6;
		border-radius: 8rpx;
		font-size: 22rpx;
		color: #fff;
	}

	.nei {
		width: 100%;
		padding: 20upx 20upx;
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
		color: #222;
	}

	.tx {
		width: 80upx;
		height: auto;
		border-radius: 50%;
		height: auto;

	}

	.left-triangle {
		height: 0px;
		width: 0px;
		border-width: 20rpx;
		border-style: solid;
		border-color: transparent #fff transparent transparent;
		margin-top: 20rpx;
	}


	.right-triangle {
		height: 0px;
		width: 0px;
		border-width: 20rpx;
		border-style: solid;
		border-color: transparent transparent transparent #3387FF;
		margin-top: 20rpx;
	}

	.record-chatting-item-text {
		max-width: 70%;
		border-radius: 8rpx;
		background: #FFFFFF;
		// background-color: #3387FF;
		padding: 16rpx;
		box-sizing: border-box;
		word-wrap: break-word;
		overflow: hidden;
		font-size: 32rpx;
		line-height: 48rpx;
	}

	.self {
		display: flex;
		flex-direction: row;
		justify-content: flex-end;

		color: #fff;
	}

	.bg {
		background: #3387ff;
	}

	// 语音播放
	.audio-wrapper {
		background-color: #fff;
		background: #3387ff;
		border-radius: 28rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 20rpx;
		min-width: 30%;
		box-sizing: border-box;
		margin-left: -2px;
	}
</style>
